<template>
  <van-picker title="性别" show-toolbar :columns="columns" :default-index="value" @confirm="onConfirm"
    @cancel="$emit('close')" @change="onChange" />
</template>

<script>
// 导入接口
import { changeUserProfile } from '@/api/user.js'
export default {
  props: {
    value: {
      type: Number,
      require: true
    }
  },
  name: 'UpdateGender',
  data () {
    return {
      // 选项
      columns: ['男', '女'],
      // 提交数据
      gender: this.value
    }
  },
  methods: {
    async onConfirm () {
      this.$toast.loading({
        duration: 0, // 持续展示toast
        message: '修改中',
        forbidclick: 'true' // 禁止点击背景
      })
      try {
        await changeUserProfile({
          gender: this.gender
        })
        this.$emit('input', this.gender)
        this.$emit('close')
        this.$toast('修改成功')
      } catch (err) {
        console.log(err)
        this.$toast('修改失败，请重试')
      }
    },
    onChange (picker, value, index) {
      // console.log(picker, value, index)
      this.gender = index
    }
  },
  computed: {},
  watch: {},
  filters: {},
  components: {},
  created () { },
  mounted () { }
}
</script>

<style lang='less' scoped>
</style>
